<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>礼物列表</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>

    <link rel="stylesheet" href="css/weui.css" />
    <link rel="stylesheet" href="css/weuix.css" />
    <script src="js/zepto.min.js"></script>

    <!-- vue -->
    <script src="js/vue.js"></script>
</head>

<body>

    <div class="page-hd">
        <h1 class="page-hd-title">
            礼物列表
        </h1>
    </div>

    <div id="app-4">

        <div v-for="gift in gifts" @click="doThis(gift.id)" class="weui-cells">
            <a class="weui-media-box weui-media-box_appmsg">
                <div class="weui-media-box__hd">
                    <img class="weui-media-box__thumb" :src="gift.img" alt="">
                </div>
                <div class="weui-media-box__bd">
                    <h4 class="weui-media-box__title">
                        {{gift.name}} </h4>
                    <p class="f116 f-red" style="font-size: 16px"> 开抢时间：{{gift.startTime}}</p>
                    <p class="weui-media-box__desc">
                </div>
            </a>
        </div>

    </div>

    <br>
    <br>
    <div class="weui-footer weui-footer_fixed-bottom">
        <p class="weui-footer__links">
            <a href="" class="weui-footer__link">联系我们</a>
        </p>
        <p class="weui-footer__text">Copyright &copy; YYDLZ</p>
    </div>

</body>


<script type="text/javascript">
    var dataPost = {};
    dataPost["pageNum"] = 0;
    dataPost["pageSize"] = 50;

    var app4 = new Vue({
        el: '#app-4',
        data: {
            gifts: []
        },
        beforeCreate() {
            if (document.cookie.length > 0) {
                return
            }

            let code = getQueryVariable("code")
            console.log(code)
            $.ajax({
                type: 'post',
                url: '/usersapi/getUserId',
                contentType: 'application/json',
                dataType: 'json',
                data: JSON.stringify({
                    "code": code,
                }),
                success: function(data) {
                    console.log(data)
                    if (Object.keys(data)[0] == 'code') {
                        window.location.href = '/error2.html'
                    }

                },
                error: function() {}
            })
        },
        beforeMount() {
            $.ajax({
                type: 'post',
                url: '/giftapi/queryByLimit',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify(dataPost),
                success: function(data) {
                    console.log(data)
                    console.log(app4.$data)
                    app4.$data.gifts = data
                },
                error: function() {
                    console.log("error in ajax.")
                }
            });
        },
        methods: {
            doThis: function(giftid) {
                console.log('/editGift.html?giftId=' + giftid)
                window.location.href = '/editGift.html?ID=' + giftid
            }
        }
    })

    function getQueryVariable(variable) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split("=");
            if (pair[0] == variable) {
                return pair[1];
            }
        }
        return (false);
    }
</script>
<style>

</style>

</html>